import React,{Component} from 'react';
import {
    ScrollView,
    View,
    Text,
    TextInput,
    TouchableOpacity,
    FlatList
} from 'react-native'
import StyCom from '../../../../components/Style';
import Tool from '../../../../components/Tool';
import Indicator from '../../../../components/Indicator';
import moment from 'moment';
const Color  = StyCom.color;
const Font = StyCom.fontSize;
export default class Notice extends Component{
    constructor(props) {
        super(props);
       // this.sta
        this.state= {
            noticeInfo:[],
            indicator: {visible: true, message: ''}//控制遮罩层
        }
    }

    componentDidMount() {
        this._selectDetail();
    }
    _selectDetail(){
        let _this = this;
        Tool.fetchJson(Tool.appPath.mkst+'advertise/getAdvertiseDetail?id='+_this.props.navigation.getParam('noticeId'),'',function (data) {
            if(data.state){
                _this.setState({
                    noticeInfo:data.info
                });
            }
            _this.setState({indicator: {visible: false, message: ''}});
        },function (error) {
            _this.setState({indicator: {visible: false, message: '查询有误!'}});
        },function () {

        });
    }

    render(){
        const Dimensions = require('Dimensions');
        const width = Dimensions.get('window').width;
        let notice = this.state.noticeInfo;
        return(
            <View style={[styles.contentView]}>
               <View style={styles.infoView}>
                    <InputView  title={'公告标题'} color={Color.blue} value={notice.name}/>
                    <InputView  title={'公告内容'} color={Color.green} value={notice.content}/>
                    <InputView  title={'创建时间'} color={Color.yellow} value={moment(notice.publishTime).format('YYYY-MM-DD')}/>
                    <InputView  title={'创建者'} color={Color.green} value={notice.a4Name}/>
                    <InputView  title={'过期时间'} color={Color.red} value={moment(notice.abateTime).format('YYYY-MM-DD')}/>
               </View>
                <Indicator isVisible={this.state.indicator.visible} message={this.state.indicator.message}/>
            </View>
        )
    }
}

class InputView extends Component{
    render(){
        return(
            <View style={{paddingLeft:10,marginBottom:20,borderColor:Color.lightGray,borderBottomWidth:1,borderStyle:'dotted'}}>
                <Text style={[styles.textView,{color:this.props.color}]}>{this.props.title}</Text>
                <Text style={{color:Color.gray,fontSize:Font.normal,marginTop:20,marginBottom:5}}>{this.props.value}</Text>
            </View>
        )
    }
}
const styles = {
    buttonView:{
        backgroundColor:Color.blue,
        width:80,
        height:30,
        borderRadius:50,
        justifyContent:'center',
        //alignSelf:'flex-end',
    },
    contentView:{
        backgroundColor:StyCom.color.white,
        flex:1
    },
    infoView:{
        paddingLeft:40,
        paddingTop:30,
        paddingRight:40,
        flex:1,

    },
    textView:{
        fontSize:StyCom.fontSize.normal,
    },
    textInputView: {
        marginTop: -10,
        marginLeft:10,
      //  height:50,
        borderBottomWidth:0.2,
        borderBottomColor:StyCom.color.gray,
        flexDirection: 'column',
        justifyContent: 'center',
    },
}